<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta  charset="UTF-8">
	<link rel="stylesheet" type="text/css" charset="UTF-8" href="/js/easyui/themes/default/easyui.css" th:href="@{js/easyui/themes/default/easyui.css}"/>
	<link rel="stylesheet" type="text/css" charset="UTF-8" href="/js/easyui/themes/icon.css" th:href="@{js/easyui/themes/icon.css}" />
	<link rel="stylesheet" type="text/css" charset="UTF-8" href="/css/login.css" th:href="@{css/login.css}" />
	<script type="text/javascript" charset="UTF-8" src="/js/easyui/jquery.min.js" th:src="@{js/easyui/jquery.min.js}"></script>
	<script type="text/javascript" charset="UTF-8" src="/js/easyui/jquery.easyui.min.js" th:src="@{js/easyui/jquery.easyui.min.js}"></script>
	<script type="text/javascript" charset="UTF-8" src="/js/easyui/locale/easyui-lang-zh_CN.js" th:src="@{js/easyui/locale/easyui-lang-zh_CN.js}"></script>
	<title>中移铁通九江分公司</title>
</head>
<body onload="loadTopWindow()">
	<div id="loginWin">
		<div id="login">
			<div class="from-line">
				<input id ="username" class="from-input" />
			</div>
			<div class ="from-line">
				<input id ="password" class="from-input" />
			</div>
		</div>
		<div id ="btn">
			<a class="easyui-linkbutton">登陆</a>
		</div>
	</div>
</body>
<!--
<script type="text/javascript" charset="UTF-8" src="/js/login.js" th:src="@{js/login.js}"></script>
-->
<script type="text/javascript">
    $(function(){
        //登陆界面
        $('#loginWin').dialog ({
            title:'用户登陆',
            width:400,
            height:280,
            modal:true,
            closable:false,
            draggable:false,
            iconCls:'icon-lock',
            buttons:'#btn',
        });

        //账号验证
        $('#username').textbox({
            required:true,
            iconCls:'',
            prompt : "请输入手机号/邮箱",
            missingMessage:'请输入账号',
            invalidMessage:'账号不得为空',
        });

        //密码验证
        $('#password').passwordbox({
            required:true,
            iconCls:'',
            prompt : "请输入密码",
            validType : 'length[5,30]',
            missingMessage:'请输入密码',
            invalidMessage:'请输入6-30位密码',
        });

        //单击登陆验证
        $('#btn a').click(function(){
            var  user={"username":$('#username').val(),"password":$('#password').val()};
            if(!$('#username').textbox('isValid')){
                $('#username').focus();
            }else if(!$('#password').passwordbox('isValid')){
                $('#password').focus();
            }else{
                $.ajax({
                    url :'/login',
                    type :'post',
                    data:{
                        username : $('#username').val(),
                        password : $('#password').val(),
                    },
                    beforeSend:function(){
                        $.messager.progress({
                            text:'正在登录中...',
                        });
                    },
                    success:function(data,response,status){
                        $.messager.progress('close');
                        if(data.message == '登陆成功！'){
                            location.href = '/main'
                        }else{
                            $.messager.alert('登陆失败！','用户名或密码错误！','warning',function(){
                                $('password').select;
                            });

                        }
                    },
                });
            }
        });

        //加载时验证
        if(!$('#username').validatebox('isValid')){
            $('#username').focus();
        }else if(!$('#password').validatebox('isValid')){
            $('#password').focus();
        }
    });


    /**
     * 判断是否为顶层页面 如果不是变成顶层页面
     */
    function loadTopWindow() {

        if (navigator.userAgent.toLowerCase().indexOf('msie') >= 0 || !document.createElement('canvas').getContext) {
            $('#loginWin').remove();
            alert("本系统运用了HTML5和CSS3技术，请您使用Google Chrome，Mozilla Firefox和Microsoft IE 10+等支持HTML5和CSS3技术的浏览器登录系统");
            return;
        }

        if (window.top != null) {
            if (window.top.document.URL != document.URL) {
                window.top.location = document.URL;
            }
        }
    }
</script>
</html>